<form class="ir-info" nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()"
      style="padding: 0.2rem; background-color: #353c70; margin-top: -20px;"
      onkeypress="if(event.keyCode===13||event.which===13){return false;}">

    <div nz-row nzGutter="16">
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Incident_Id' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input placeholder="" nz-input formControlName="eventId"/>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nz-col nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzRequired nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <!-- <nz-select *ngIf='isIrCreated' formControlName="veri_State">
                        <nz-option nzValue="0" nzLabel="Anticipated"></nz-option>
                    </nz-select> -->
                    <nz-select formControlName="veri_State">
                        <nz-option *ngFor="let option of verificationStatus" [nzValue]="option.value"
                                   [nzLabel]="'TrafficManagement.ScheduledEvent.'+option.name|translate"></nz-option>
                    </nz-select>
                    <nz-form-explain
                            *ngIf="validateForm.get('veri_State')?.dirty && validateForm.get('veri_State')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Cause_Ir_Id' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="causeIrId" />
                </nz-form-control>
            </nz-form-item>
        </div> -->
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Source' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="source" />
                </nz-form-control>
            </nz-form-item>
        </div> -->
    </div>
    <div nz-row nzGutter="16">
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzRequired nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Incident_Type' | translate}}</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <!-- <input nz-input formControlName="incidentType"/> -->
                    <nz-select formControlName="type">
                        <nz-option *ngFor="let option of incidentType" [nzValue]="option.value"
                                   [nzLabel]="'TrafficManagement.ScheduledEvent.'+option.name|translate"></nz-option>
                    </nz-select>
                    <nz-form-explain
                            *ngIf="validateForm.get('type')?.dirty && validateForm.get('type')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <!-- <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Incident Sub Type</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="irSub" />
                </nz-form-control>
            </nz-form-item> -->
            <!-- <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-control nz-col nzSpan="12">
                    <nz-radio-group formControlName="radioValue">
                        <label nz-radio nzValue="A">A</label>
                        <label nz-radio nzValue="B">B</label>
                    </nz-radio-group>
                </nz-form-control>
            </nz-form-item> -->
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Zone_ID' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input placeholder="Enter Numbers" nz-input formControlName="zone_ID"/>
                    <!--<nz-form-explain
                    *ngIf="validateForm.get('zone_ID')?.dirty && validateForm.get('zone_ID')?.errors">
                    {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>-->
                </nz-form-control>
            </nz-form-item>
        </div>
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Cause' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="cause" />
                </nz-form-control>
            </nz-form-item>
        </div> -->
    </div>
    <div nz-row nzGutter="16">
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzRequired nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Road_Name' | translate}}</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="road_Name"/>
                    <nz-form-explain
                            *ngIf="validateForm.get('road_Name')?.dirty && validateForm.get('road_Name')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzRequired nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Location_Type' | translate}}</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <!-- <input placeholder="Enter Numbers" nz-input formControlName="location_Type" /> -->
                    <nz-select formControlName="location_Type">
                        <nz-option *ngFor="let option of locationTypeList" [nzValue]="option.value"
                                   [nzLabel]="'TrafficManagement.ScheduledEvent.'+option.name|translate"></nz-option>
                    </nz-select>
                    <nz-form-explain
                            *ngIf="validateForm.get('location_Type')?.dirty && validateForm.get('location_Type')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nzRequired nz-col nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Location_Sub_Type' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <!-- <input placeholder="Enter Numbers" nz-input formControlName="location_SubType" /> -->
                    <nz-select formControlName="location_SubType">
                        <nz-option *ngFor="let option of locationSubTypeList" [nzValue]="option.value"
                                   [nzLabel]="'TrafficManagement.ScheduledEvent.'+option.name|translate"></nz-option>
                    </nz-select>
                    <nz-form-explain
                            *ngIf="validateForm.get('location_SubType')?.dirty && validateForm.get('location_SubType')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.direction' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="direction" />
                </nz-form-control>
            </nz-form-item>
        </div> -->
    </div>
    <!-- <div nz-row nzGutter="16">
        <div nz-col class="gutter-row" nzSpan="12">
            <p style="color: #1890ff;">Start Point</p>
        </div>
        <div nz-col class="gutter-row" nzSpan="12">
            <p style="color: #1890ff;">End Point</p>
        </div>
    </div> -->
    <div nz-row nzGutter="16">
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center;cursor:pointer">
                <nz-form-label nzRequired nz-col nzRequired nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Start_Point' | translate}}</nz-form-label>
                <nz-form-control nz-col nzSpan="10">
                    <input placeholder="number,number" nz-input formControlName="startCoor"/>
                    <nz-form-explain
                            *ngIf="validateForm.get('startCoor')?.dirty && validateForm.get('startCoor')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
                <span nz-col nzSpan="2">
					<i class="iconfont icon-dingwei" [style.color]="inGet.startCoor?'#238ce6':''"
                       (click)="getGisPosition('startCoor')"></i>
				</span>
            </nz-form-item>
        </div>
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Latitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="start_Y_Coor"/>
                </nz-form-control>
            </nz-form-item>
        </div> -->
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center;cursor:pointer">
                <nz-form-label nzRequired nz-col nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.End_Point' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="10">
                    <input placeholder="number,number" nz-input formControlName="endCoor"/>
                    <nz-form-explain
                            *ngIf="validateForm.get('endCoor')?.dirty && validateForm.get('endCoor')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
                <span nz-col nzSpan="2">
						<i class="iconfont icon-dingwei" [style.color]="inGet.endCoor?'#238ce6':''"
                           (click)="getGisPosition('endCoor')"></i>
					</span>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center;cursor:pointer">
                <nz-form-label nzRequired nz-col nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Q_End_Point' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="10">
                    <input placeholder="number,number" nz-input formControlName="QendCoor"/>
                    <nz-form-explain
                            *ngIf="validateForm.get('QendCoor')?.dirty && validateForm.get('QendCoor')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
                <span nz-col nzSpan="2">
					<i class="iconfont icon-dingwei" [style.color]="inGet.endCoor?'#238ce6':''"
                       (click)="getGisPosition('QendCoor')"></i>
				</span>
            </nz-form-item>
        </div>
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Latitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="end_Y_Coor"/>
                </nz-form-control>
            </nz-form-item>
        </div> -->
        <!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center;cursor:pointer">
                <nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Q_End_Point' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="10">
                    <input nz-input formControlName="QendCoor" />
                </nz-form-control>
                <span nz-col nzSpan="2">
                    <i class="iconfont icon-dingwei1" (click)="getGisPosition('QendCoor')"></i>
                </span>
            </nz-form-item>
        </div> -->
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nzRequired nz-col nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.Q_End_Link_ID' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="q_End_Link_ID"/>
                    <nz-form-explain
                            *ngIf="validateForm.get('q_End_Link_ID')?.dirty && validateForm.get('q_End_Link_ID')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
    </div>
    <div nz-row nzGutter="16">
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="12" style="width:100%">
                <nz-form-label nz-col nzRequired nzSpan="12">
                    {{'TrafficManagement.IncidentRecord.PlanStart' | translate}}</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <!-- <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="start_Time"></nz-date-picker> -->
                    <!--<input nz-input formControlName="QSPStartTime"/>-->
                    <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="planStart"
                                    [nzDisabledDate]="disabledDate"
                                    [nzDisabledTime]="disabledRangeTime"></nz-date-picker>
                    <!-- <nz-range-picker [nzDisabledDate]="disabledDate" [nzDisabledTime]="disabledRangeTime"
                        formControlName="incidentTimeRange"></nz-range-picker> -->
                    <nz-form-explain
                            *ngIf="validateForm.get('planStart')?.dirty && validateForm.get('planStart')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nzRequired nz-col nzSpan="9">{{'TrafficManagement.IncidentRecord.Q_Time' | translate}}
                </nz-form-label>
                <nz-form-control nz-col nzSpan="15">
                    <!-- <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="end_Time"></nz-date-picker> -->
                    <!--<input nz-input formControlName="QSPEndTime"/>-->
                    <nz-range-picker formControlName="QTimeRange"></nz-range-picker>
                    <nz-form-explain
                            *ngIf="validateForm.get('QTimeRange')?.dirty && validateForm.get('QTimeRange')?.errors">
                        {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                    </nz-form-explain>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="12">
            <div nz-row nzGutter="16">
                <div nz-col nzSpan="12">
                    <nz-form-item nz-col nzSpan="12" style="width:100%">
                        <nz-form-label nz-col nzSpan="12" nzRequired>
                            {{'TrafficManagement.IncidentRecord.Lane_Blockage' | translate}}</nz-form-label>
                        <nz-form-control nz-col nzSpan="12">
                            <div>
								<span *ngFor="let option of laneBlockagesList;let idx = index" (click)='deletLaneBlockage(idx)'>
									<img class="img-lane" [src]="'../content/images/icons/' + LANE_BLOCKAGES[option]" style="width: 20px;">
								</span>
                                <nz-dropdown [nzTrigger]="'click'" [ngStyle]="{verticalAlign: 'middle'}">
                                    <a nz-dropdown><i class="iconfont icon-add"></i></a>
                                    <ul nz-menu>
                                        <li nz-menu-item *ngFor="let option of LANE_BLOCKAGES;let idx = index"
                                            (click)='addLaneBlockages(idx)'>
                                            <img class="img-lane" [src]="'../content/images/icons/'+ option"
                                                 style="width: 20px;">
                                        </li>
                                    </ul>
                                </nz-dropdown>
                            </div>
                            <!-- <input nz-input formControlName="laneBlockages" style="display: none"/> -->
                            <!-- <nz-select
                                    [nzMaxTagPlaceholder]="tagPlaceHolder"
                                    style="width: 100%"
                                    nzMode="multiple"
                                    formControlName="laneBlockage"
                            >
                                <nz-option *ngFor="let option of listOfOption" [nzLabel]="option.label" [nzValue]="option.value" nzCustomContent >
                                    <img class="img-lane" [src]="'../content/images/icons/' + option.label" style="width: 20px;">
                                </nz-option>
                            </nz-select> -->
                        </nz-form-control>
                    </nz-form-item>
                </div>
                <div nz-col nzSpan="12">
                    <nz-form-item nz-col nzSpan="12" style="width:100%">
                        <nz-form-label nz-col nzRequired nzSpan="12">
                            {{'TrafficManagement.IncidentRecord.PlanEnd' | translate}}</nz-form-label>
                        <nz-form-control nz-col nzSpan="12">
                            <!-- <input nz-input formControlName="expectedTimeToClear"/> -->
                            <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="planEnd"></nz-date-picker>
                            <nz-form-explain
                                    *ngIf="validateForm.get('planEnd')?.dirty && validateForm.get('planEnd')?.errors">
                                {{"EquipmentManagement.EquipmentManagement.The_input_is_not_valid" | translate}}
                            </nz-form-explain>
                        </nz-form-control>
                    </nz-form-item>
                </div>
            </div>
        </div>
    </div>
    <div nz-row nzGutter="16" style="padding-top: 0.2rem;">
        <!-- <div nz-col class="gutter-row" nzSpan="12">
            <div nz-row nzGutter="16">
                <div  nz-col nzSpan="12">
                    <nz-form-item  nz-col nzSpan="12" style="width:100%">
                        <nz-form-label nz-col nzSpan="12">Lane Blockage</nz-form-label>
                        <nz-form-control nz-col nzSpan="12">
                            <div>
                                <span *ngFor="let option of laneBlockagesList;let idx = index" (click)='deletLaneBlockage(idx)'>
                                    <img class="img-lane" [src]="'../content/images/icons/' + LANE_BLOCKAGES[option]" style="width: 20px;">
                                </span>
                            </div>
                            <div>
                                <nz-dropdown [nzTrigger]="'click'">
                                        <a nz-dropdown><i class="iconfont icon-add"></i></a>
                                        <ul nz-menu>
                                          <li nz-menu-item *ngFor="let option of LANE_BLOCKAGES;let idx = index" (click) = 'addLaneBlockages(idx)'>
                                                <img class="img-lane" [src]="'../content/images/icons/'+ option" style="width: 20px;" >
                                          </li>
                                        </ul>
                                      </nz-dropdown>
                            </div>
                            <input nz-input formControlName="laneBlockages" style="display: none"/>
                            <nz-select
                                    [nzMaxTagPlaceholder]="tagPlaceHolder"
                                    style="width: 100%"
                                    nzMode="multiple"
                                    formControlName="laneBlockage"
                            >
                                <nz-option *ngFor="let option of listOfOption" [nzLabel]="option.label" [nzValue]="option.value" nzCustomContent >
                                    <img class="img-lane" [src]="'../content/images/icons/' + option.label" style="width: 20px;">
                                </nz-option>
                            </nz-select>
                        </nz-form-control>
                    </nz-form-item>
                </div>
                <div  nz-col nzSpan="12">
                    <nz-form-item nz-col nzSpan="12" style="width:100%">
                        <nz-form-label nz-col nzSpan="12">Expected Time To Clear</nz-form-label>
                        <nz-form-control nz-col nzSpan="12">
                            <input nz-input formControlName="expectedTimeToClear"/>
                            <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="eTime"></nz-date-picker>
                        </nz-form-control>
                    </nz-form-item>
                </div>
            </div>
            <div nz-row nzGutter="16" style="padding-top: 0.1rem;">
                <div  nz-col nzSpan="24">
                    <nz-form-label nz-col nzSpan="6">Incident Description</nz-form-label>
                    <div nz-col nzSpan="18">
                    <textarea
                            nz-input
                            placeholder=""
                            [nzAutosize]="{ minRows: 3, maxRows: 3 }"
                            formControlName="Description"
                    &gt;</textarea>
                    </div>
                </div>
            </div>
        </div> -->
        <div nz-col class="gutter-row" nzSpan="12">
            <nz-form-item nz-col nzSpan="24" style="width: 100%;">
                <nz-form-label nz-col nzSpan="6">{{'TrafficManagement.IncidentRecord.Remark' | translate}}
                </nz-form-label>
                <div nz-col nzSpan="18">
                    <textarea nz-input placeholder="" formControlName="remark"></textarea>
                    <!-- [nzAutosize]="{ minRows: 1, maxRows: 1 }" -->
                </div>
            </nz-form-item>
        </div>
    </div>

    <div nz-row nzGutter="16">
        <div nz-row nzGutter="16" *ngIf="ifMoreInfoShow">
            <div class="buttonSet" nz-row>
                <div nz-col nzSpan="2">
                    <button nz-button nzType="primary"
                            nzBlock>{{'TrafficManagement.IncidentRecord.More_Info' | translate}}
                    </button>
                </div>
                <!-- (click)="showModal()" -->
            </div>
        </div>
        <div nz-row nzGutter="16">
            <div class="buttonSet" nz-row>
                <div nz-col nzSpan="2" *ngIf="isVerify">
                    <button nz-button nzType="default" nzBlock (click)="verify()" *ngIf="isEditable && !isClickEdit"
                            type="button">{{'TrafficManagement.IncidentRecord.verify' | translate}}</button>
                </div>
                <!-- (click)="verify()" -->
                <div nz-col nzSpan="2" *ngIf="isBeginBow">
                    <button nz-button nzType="default" nzBlock
                            (click)="beginNow()" *ngIf="isEditable && !isClickEdit"
                            type="button">{{'TrafficManagement.IncidentRecord.begin' | translate}}</button>
                </div>
                <!-- <div nz-col nzSpan="2" *ngIf="isFinishShow"> <button nz-button nzType="default" nzBlock
                        (click)="finish()" type="button">{{'TrafficManagement.IncidentRecord.Finish' | translate}}</button></div> -->
                <div nz-col nzSpan="2" *ngIf="isClickEdit">
                    <button nz-button nzType="default" nzBlock (click)="back()"
                            type="button">{{'TrafficManagement.IncidentRecord.Cancel' | translate}}</button>
                </div>
                <div nz-col nzSpan="2" *ngIf="!isClickEdit">
                    <button nz-button nzType="default" nzBlock (click)="cancelEditFunc()"
                            type="button">{{'TrafficManagement.IncidentRecord.Invalid' | translate}}</button>
                </div>
                <div nz-col nzSpan="2" *ngIf="isEditable && !isClickEdit && accessButton?.Edit">
                    <button nz-button nzType="dashed" type="button" nzBlock
                            (click)="editForm()">{{'TrafficManagement.IncidentRecord.Edit' | translate}}</button>
                </div>
                <div nz-col nzSpan="2" *ngIf="isClickEdit">
                    <button nz-button nzType="primary"
                            nzBlock>{{'TrafficManagement.IncidentRecord.Save' | translate}}</button>
                </div>
                <!-- <div nz-col nzSpan="2"> <button nz-button nzType="dashed" type="button" nzBlock
                        (click)="qweqwe()">qweqwe</button></div> -->
            </div>
        </div>
    </div>
</form>

<nz-modal [(nzVisible)]="isForceVisible"
          nzTitle="{{'TrafficManagement.IncidentRecord.Cross region operation' | translate}}"
          (nzOnCancel)="FourchHandleCancel()" (nzOnOk)="ForceHandleOk()">
    <div>
        {{'TrafficManagement.IncidentRecord.Further operation, mandatory operation still available' | translate}}
    </div>
</nz-modal>
<nz-modal [(nzVisible)]="isForceCancelVisible" class="dialog-s"
          nzTitle="{{'TrafficManagement.IncidentRecord.Cross region operation' | translate}}"
          (nzOnCancel)="isForceCancelVisible=false" (nzOnOk)="cancelEditFunc(true)">
    <div>
        {{'TrafficManagement.IncidentRecord.Further operation, mandatory operation still available' | translate}}
    </div>
</nz-modal>

<nz-modal [(nzVisible)]="isForceBeginNowVisible"
          nzTitle="{{'TrafficManagement.IncidentRecord.Cross region operation' | translate}}"
          (nzOnCancel)="isForceBeginNowVisible=false" (nzOnOk)="beginNow(true)">
    <div>
        {{'TrafficManagement.IncidentRecord.Further operation, mandatory operation still available' | translate}}
    </div>
</nz-modal>
<!-- <div class="tableSet" nz-row>
	<div nz-col nzSpan="14" style="padding: 0.2rem;border:5px solid rgba(96, 184, 246, 0.11);margin: 0.2rem;">
		<div class="buttonSetBelow">
			<div class="title">
				<h3>{{'TrafficManagement.IncidentRecord.Partner' | translate}}</h3>
			</div>
			<div class="table-buttons-left">
				<div class="operate" style="margin-right: 0.1rem">
					<i class="iconfont icon-add"></i>{{'TrafficManagement.IncidentRecord.Add_Partner' | translate}}
				</div>
				<div class="left-button-last" style="margin-right: 0.1rem"><i class="iconfont icon-refresh1"></i></div>
				<div class="left-button-last" style="margin-right: 0.1rem"><i class="iconfont icon-pen01"></i></div>
				<div class="left-button-last" style="margin-right: 0.1rem"><i class="iconfont icon-fork"></i></div>
			</div>
		</div>
		<nz-table #basicTable [nzData]="listOfData" [nzShowPagination]='false' [nzScroll]="{ y: '240px' }">
			<thead>
				<tr>
					<th>{{'TrafficManagement.ScheduledEvent.ID' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.Type' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.VehicleNO' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.OfficerName' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.OfficerContact' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.Departure' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.Arrival' | translate}}</th>
					<th>{{'TrafficManagement.ScheduledEvent.Notify' | translate}}</th>
				</tr>
			</thead>
			<tbody>
				<tr *ngFor="let data of basicTable.data">
					<td>{{ data.name }}</td>
					<td>{{ data.address }}</td>
					<td>{{ data.address }}</td>
					<td>{{ data.address }}</td>
					<td>{{ data.address }}</td>
					<td>{{ data.address }}</td>
					<td>{{ data.address }}</td>
				</tr>
			</tbody>
		</nz-table>
	</div>
	<div nz-col nzSpan="8" style="padding: 0.2rem;border:5px solid rgba(96, 184, 246, 0.11);margin: 0.2rem;">
		<div class="buttonSetBelow">
			<div class="title">
				<h3>{{'TrafficManagement.IncidentRecord.Comments' | translate}}</h3>
			</div>
			<div class="table-buttons-left">
				<div class="operate" style="margin-right: 0.1rem"><i
						class="iconfont icon-add"></i>{{'TrafficManagement.IncidentRecord.Add_Comments' | translate}}
				</div>
				<div class="left-button-last" style="margin-right: 0.1rem"><i class="iconfont icon-refresh1"></i></div>
				<div class="left-button-last" style="margin-right: 0.1rem"><i class="iconfont icon-pen01"></i></div>
				<div class="left-button-last" style="margin-right: 0.1rem"><i class="iconfont icon-fork"></i></div>
			</div>
		</div>
		<nz-table #basicTable1 [nzData]="listOfData2" [nzShowPagination]='false' [nzScroll]="{ y: '240px' }">
			<thead>
				<tr>
					<th>{{'TrafficManagement.IncidentRecord.ID' | translate}}</th>
					<th>{{'TrafficManagement.IncidentRecord.Description' | translate}}</th>
					<th>{{'TrafficManagement.IncidentRecord.Officer_Name_ID' | translate}}</th>
					<th>{{'TrafficManagement.IncidentRecord.Created_Time' | translate}}</th>
				</tr>
			</thead>
			<tbody>
				<tr *ngFor="let data of basicTable1.data">
					<td>{{ data.name }}</td>
					<td>{{ data.age }}</td>
					<td>{{ data.address }}</td>
					<td>{{ data.address }}</td>
				</tr>
			</tbody>
		</nz-table>
	</div>
</div> -->

<!-- <nz-modal [(nzVisible)]="isVisible" [nzTitle]=false [nzContent]="modalContent" [nzFooter]=false
		  (nzOnCancel)="handleCancel()" [nzMaskClosable]="false" [nzWidth]="'12.94rem'">
	<ng-template #modalContent>
		<div class="moreInfoPopUp">
			<form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()"
				  style="padding: 0.2rem; border-bottom: 1px solid rgb(232, 232, 232)"
				  onkeypress="if(event.keyCode===13||event.which===13){return false;}">
				<div nz-row nzGutter="16">
					<div nz-col class="gutter-row" nzSpan="8">
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Incident_ID' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="ir_ID" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
					</div>
					<div nz-col class="gutter-row" nz-col nzSpan="16">
						<nz-table #basicTable3 [nzData]="listOfData3" [nzShowPagination]='false'>
							<thead>
								<tr>
									<th>{{'TrafficManagement.IncidentRecord.ID' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Type' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Vehicle_No.' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Officer_Name_ID' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Officer_Contact_No' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Departure_Time' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Arrival_Time' | translate}}</th>
									<th>{{'TrafficManagement.IncidentRecord.Notify_Time' | translate}}</th>
								</tr>
							</thead>
							<tbody>
								<tr *ngFor="let data of basicTable.data">
									<td>{{ data.name }}</td>
									<td>{{ data.age }}</td>
									<td>{{ data.address }}</td>
									<td>{{ data.address }}</td>
									<td>{{ data.address }}</td>
									<td>{{ data.address }}</td>
									<td>{{ data.address }}</td>
									<td>{{ data.address }}</td>
								</tr>
							</tbody>
						</nz-table>
					</div>
				</div>
			</form>
		</div>
	</ng-template>
</nz-modal>
<nz-modal [(nzVisible)]="otherInfoShow" [nzTitle]=false [nzContent]="modalContent" [nzFooter]=false
		  (nzOnCancel)="handleCancel()" [nzMaskClosable]="false" [nzWidth]="'6.94rem'">
	<ng-template #modalContent11>
		<div class="moreInfoPopUp">
			<form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()"
				  style="padding: 0.2rem; border-bottom: 1px solid rgb(232, 232, 232)"
				  onkeypress="if(event.keyCode===13||event.which===13){return false;}">
				<div nz-row nzGutter="16">
					<div nz-col class="gutter-row" nzSpan="24">
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Incident_ID' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="ir_ID" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
					</div>
				</div>
			</form>
		</div>
	</ng-template>
</nz-modal> -->
